<template>
    <div>
        <!-- 到站预报-电厂 2018年8月4日15:08:00 john -->

        <Row>
            <i-col span="24">
                <Tabs v-model="currentTab.index" @on-click="switchTab">
                    <template v-for="item in tabList">
                        <TabPane :label="item.label" :name="item.val"></TabPane>
                    </template>
                </Tabs>
                <tablePage ref="inspectionTab":staticData="staticData2" :param="queryParam" :mode="1"
                           sort-name="orderNo"
                           sort-type="desc" :isStartLoad="true" v-if="currentTab.index==tabList[0].val">
                    <template slot-scope="props">
                        <Table :columns="inspectionColumn" :data="props.data" @on-sort-change="props.sortChange"
                               border></Table>
                    </template>
                </tablePage>


            </i-col>
        </Row>
    </div>
</template>

<script>
  import tablePage from '@components/table/tablePage.vue'
  import {
    getPredictionStationList
  } from '@api/backEnd/mainOrder'
  import moment from 'moment'

  export default {
    name: 'logistics-inspection',
    data () {
      let tabList = [
        {label: '列表', val: '1'}// ,
        // {label: '今日运单', val: '2'}
      ]
      let currentTab = {index: '1'}
      let queryParam = {}
      let staticData2 = []
      let inspectionColumn = [
        {
          title: '联运单号',
          key: 'orderNo',
          width: 200,
          fixed: 'left'
        },
        // {
        //   title: '起始站',
        //   key: 'startStationName',
        //   width: 100
        // },
        {
          title: '终点站',
          key: 'endStationName',
          width: 100
        },
        // {
        //   title: '起始站出发时间',
        //   width: 150,
        //   key: 'startStationTime',
        //   sortable: true,
        //   render: (h, params) => {
        //     let thisdata = params.row.startStationTime
        //     return (<span>{thisdata ? moment(thisdata).format('YYYY-MM-DD HH:mm') : ''}</span>)
        //   }
        // },
        // {
        //   title: '预计到站时间',
        //   width: 150,
        //   key: 'pro_end_time',
        //   sortable: true,
        //   render: (h, params) => {
        //     let thisdata = params.row.proEndTime
        //     return (<span>{thisdata ? moment(thisdata).format('YYYY-MM-DD HH:mm') : ''}</span>)
        //   }
        // },
        {
          title: '到达终点站时间',
          width: 150,
          key: 'endStationTime',
          sortable: true,
          render: (h, params) => {
            let thisdata = params.row.endStationTime
            return (<span>{thisdata ? moment(thisdata).format('YYYY-MM-DD HH:mm') : ''}</span>)
          }
        },
        // {
        //   title: '最近一条动态',
        //   ellipsis: 'false',
        //   key: 'info',
        //   width: 250
        // },
        // {
        //   title: '最近一条时间',
        //   ellipsis: 'false',
        //   key: 'time',
        //   width: 250
        // },
        // {
        //   title: '托运人',
        //   ellipsis: 'false',
        //   key: 'shipper',
        //   width: 250
        // },
        // {
        //   title: '收货人',
        //   ellipsis: 'false',
        //   key: 'receiver',
        //   width: 250
        // }
        {
          title: '车次号',
          ellipsis: 'false',
          key: 'endTrainNumber',
          width: 250
        },
        {
          title: '首车车号',
          ellipsis: 'false',
          key: 'fristTrainNumber',
          width: 250
        },
        {
          title: '首车箱号',
          ellipsis: 'false',
          key: 'fastContainerNo',
          width: 250
        },
        {
          title: '尾车车号',
          ellipsis: 'false',
          key: 'lastTrainNumber',
          width: 250
        },
        {
          title: '尾车箱号',
          ellipsis: 'false',
          key: 'lastContainerNo',
          width: 250
        }
      ]
      let operatModal = {
        viewDetailShow: false
      }
      let datas = {
        tabList,
        currentTab,
        queryParam,
        staticData2,
        inspectionColumn,
        operatModal,
        getPredictionStationList
      }
      return datas
    },
    computed: {},
    watch: { },
    created () {
      getPredictionStationList({}).then(res => {
        console.log(res)
        this.staticData2 = res.data.data.rows
      })
    },
    methods: {
      switchTab () {
        this.queryParam.like = ''
        if (this.currentTab.index === 1) {
          this.lableName = '车队'
          this.selectList = this.fleetSelectList
        }
        this.$nextTick(() => {
          // this.dataRefresh()
        })
      },
      /**
       * TODO(查看详情)
       * @auther zhangQ
       * @date 2018/3/16 11:06
       **/
      viewDetailAction (row) {
        console.log(row)
        this.mainOrderCurrentRow = row
        this.operatModal.viewDetailShow = true
      }
    },
    mounted () {
    },
    components: {
      tablePage
    }
  }
</script>

<style scoped>

</style>
